<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">
    <!-- Google Chrome Frame也可以让IE用上Chrome的引擎: -->
    <meta name="renderer" content="webkit">
    <!--国产浏览器高速模式-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>作业管理系统</title>

    <!-- 公共样式 开始 -->
    <link rel="stylesheet" type="text/css" href="../../css/base.css">
    <link rel="stylesheet" type="text/css" href="../../css/iconfont.css">
    <script type="text/javascript" src="../../framework/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../../layui/css/layui.css">
    <script type="text/javascript" src="../../layui/layui.js"></script>
    <!-- 滚动条插件 -->
    <link rel="stylesheet" type="text/css" href="../../css/jquery.mCustomScrollbar.css">
    <script src="../../framework/jquery-ui-1.10.4.min.js"></script>
    <script src="../../framework/jquery.mousewheel.min.js"></script>
    <script src="../../framework/jquery.mCustomScrollbar.min.js"></script>
    <script src="../../framework/cframe.js"></script><!-- 仅供所有子页面使用 -->
    <!-- 公共样式 结束 -->
    <script type="text/javascript" src="../../framework/frameAll.js"></script>

</head>

<body>
<div class="cBody">
    <div class="console">
        <form class="layui-form" action="">
        </form>

        <script>
            layui.use('form', function () {
                var form = layui.form;

                //监听提交
                form.on('submit(formDemo)', function (data) {
                    layer.msg(JSON.stringify(data.field));
                    return false;
                });
            });
        </script>
    </div>
    <!-- 表格 -->
    <table class="layui-hide" id="demo" lay-filter="test"></table>
    <script type="text/html" id="barDemo">
        <button class="layui-btn  layui-btn-fluid layui-btn-sm  layui-btn-normal" lay-event="detail">查看</button>
    </script>
    <!-- layUI 分页模块 -->
    <div id="pages"></div>
    <script>
        layui.use('table', function () {
            var table = layui.table;
            var content = "";

            //总页数大于页码总数
            table.render({
                elem: '#demo',
                height: "full-100",
                method: "get",
                request: {
                    pageName: 'pageNo',//页码的参数名称，默认：page
                    limitName: 'pageSize' //每页数据量的参数名，默认：limit
                },
                where: {
                    action: "page",
                    content: content,
                },
                url: '/NoticeServlet.do',//数据接口
                page: true, //开启分页
                cellMinWidth: 100,
                limits: [5, 10, 15, 20, 25, 30, 35, 40, 45, 50],
                cols: [[ //表头
                    {title: '序号', type: 'numbers'},
                    {field: 'title', title: '标题'},
                    {field: 'adminName', title: '发布人', sort: true},
                    {field: 'content', title: '内容'},
                    {field: 'createTime', title: '发布时间', width: 160, align: 'center', sort: true},
                    {title: '操作', align: 'center', toolbar: '#barDemo', width: 100, fixed: 'right'}
                ]]
            });
            table.on('tool(test)', function (obj) {
                //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
                var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
                if (layEvent == 'detail') { //查看
                    layer.open({
                        type: 1,
                        anim: 4,
                        title: data.title,
                        content: data.content,
                        area: ['500px', '400px'],
                        closeBtn: 0,
                        offset: '100px',
                        shadeClose: true,
                        move: false
                    });
                }
            });
        });
    </script>
</div>
</body>

</html>